<!DOCTYPE HTML>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<link th:href="@{/ajax/libs/fancybox/jquery.fancybox.css}" rel="stylesheet"/>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
    	<div class="page-header text-center">
    		<h1 th:text="${photo.photoname}"></h1>    		
		</div>
    	<div id="phtotlistdetail"></div>
    	<div class="col-sm-3">
    		<img  src="/img/reback.png" class="img-thumbnail" alt="看不见" onclick="reback()">
    	</div>
        <form class="form-horizontal m" id="form-photo-edit" th:object="${photo}">
            <input id="photoid" name="photoid" th:field="*{photoid}"  type="hidden">
            <input id="photoname" name="photoname" th:field="*{photoname}"  type="hidden">
			<input id="photodetail" name="photodetail" th:field="*{photodetail}" class="form-control" type="hidden" readonly="readonly">
		</form>
    </div>
    <div th:include="include::footer"></div>
    <script th:src="@{/ajax/libs/fancybox/jquery.fancybox.js}"></script>
    <script type="text/javascript">
    	$(function() {
    		var photoliststr=$("#photodetail").val();
    		var photolist=photoliststr.split(",");
    		var result = [];
            for(var i=0;i<photolist.length;i+=4){
                result.push(photolist.slice(i,i+4));
            }
            var uploadurl='http://pj6u73y0v.bkt.clouddn.com/';
            var str="";
            for(var i=0;i<result.length;i++){
            	//str+='<div class="row">';
            	for(var j=0;j<result[i].length;j++){
            		str+='<div class="col-sm-3 blog-post">'
            		str+='<a href="'+uploadurl+result[i][j]+'" data-fancybox="images" data-autoscale="true"><img  src="'+uploadurl+result[i][j]+'" class="img-thumbnail" alt="看不见" ></a>';
            		str+='</div>'
            	}
            	//str+="</div>";
            }
            $("#phtotlistdetail").html(str);
    	})
    	
    	function reback(){
    		window.location.href='/system/photo/view';
    	}
	</script>
</body>
</html>
